
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>collect</title>



    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="../http:/cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/collection/news.css" type="text/css">
</head>

<body>

<%@ include file="../common/nav.jsp"%>

<div>
    <nav class="navbar navbar-inverse" role="navigation">
        <div class="container-fluid">
            <div>
                <ul class="nav navbar-nav" style="margin-left:10%;" id="dao">
                    <li><a href="#">通知提醒</a></li>
                </ul>
            </div>
        </div>
    </nav>

</div>

<div>
    <div id="left" style="width: 15%;margin-left: 10%;float: left;">
        <div class="container">
            <div>
                <!-- data-spy="affix"data-spy="affix" -->
                <!-- class="col-xs-3" -->
                <ul class="nav nav-tabs">
                    <li><a href="#">报名预约</a></li>
                </ul>
            </div>
        </div>

    </div>

    <div id="right" style="margin-top:60px;width: 65%;margin-left:280px;border:1px solid grey;">

        <div style="height:50px;margin-left:50px;margin-top:20px;">

        </div>

        <c:forEach items="${requestScope.vos}" var="n">
            <c:if test="${n.status==0}">
                <%--<c:forEach items="${requestScope.userInfos}" var="s">--%>
                <%--<c:if test="${n.id==s.id}">--%>
                <div style="height:50px;margin-left:50px;margin-top: 10px">


            <span>
                    <input type="checkbox" value="${n.id}" name="cks">

                    <a href="${path}/news/delnews?id=${n.id}" style="text-decoration: none">
                        &nbsp;&nbsp;<span class="glyphicon glyphicon-trash"></span>
                    </a>

                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${n.name}&nbsp;&nbsp;&nbsp; ${n.newsContent}&nbsp;&nbsp;&nbsp;
                <%--<fmt:formatDate value="${n.newsTime}" pattern="yyyy-MM-dd　HH：mm"/>--%>
                &nbsp;&nbsp;&nbsp;<span>您的服务已被预约请联系他</span>
                <div style="margin-left: 600px;margin-top: -25px">
                    <a href="/services/serHomePage?serId=${n.serid}" style="margin-left:200px;color:blue;margin-right: 5px;text-decoration: none">查看个人主页</a>
                </div>

                <%--<a href="#" style="margin-left:200px;color:blue;">点击查看详情</a>--%>
            </span>
                        <%--<p style="margin-left:70px;">--%>


                <span>
                    <%--<fmt:formatDate value="${n.newsTime}" pattern="yyyy-MM-dd　HH：mm"/>--%>
                </span>


                        <%--${n.newsTime}--%>

                    </p>
                </div>
                <%--</c:if>--%>
                <%--</c:forEach>--%>
            </c:if>
        </c:forEach>

        <div style="margin-left:50px;">
                <span>
                    <a href="#" style="text-decoration: none">
                        <input type="checkbox" name="checkbox" id="dou" onclick=quan()>&nbsp;&nbsp;全选
                    </a>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type='button' class='btn btn-danger'
                                                                onclick="delnewsAll()">合并删除</button>
                    </p>
                </span>
        </div>
    </div>
</div>



<!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
<script src="../plugins/jquery/jquery.min.js"></script>
<!--引入bootstrap的js文件-->
<script src="../plugins/bootstrap/js/bootstrap.js"></script>

<script src="../http:/cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="../http:/cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script>
    $(document).ready(function () {
        dropdownOpen();//调用
    });
    /**
     * 鼠标划过就展开子菜单，免得需要点击才能展开
     */
    function dropdownOpen() {

        var $dropdownLi = $('li.dropdown');

        $dropdownLi.mouseover(function () {
            $(this).addClass('open');
        }).mouseout(function () {
            $(this).removeClass('open');
        });
    }
</script>


<script>

    function delnewsAll(){

        //1. 获取所有的checkbox
        var cks = document.getElementsByName("cks");

        //2. 定义计数器
        var count = 0;

        for(var i = 0;i<cks.length;i++){
            if(cks[i].checked){
                count++;
            }
        }
        if(count==0){
            alert("sorry,请您先选择!");
            return;
        }

        var pids = "";

        for(var i=0;i<cks.length;i++){
            if(cks[i].checked){
                pids+="id="+cks[i].value+"&";
            }
        }

        alert("是否全部删除");

        var url = "${path}/news/delnewsany?"+pids;

        window.location=url.substring(0,url.length-1);
    }
</script>
<script type="text/javascript">
    function quan(){

        var checkall=document.getElementById("dou");

        var checknames=document.getElementsByName("cks");

        for(var i=0;i<checknames.length;i++){

            checknames[i].checked=checkall.checked;
        }

    }

</script>


</body>

</html>